<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>任务详情</title>
  <link rel="stylesheet" href="../layui/css/layui.css">
<!--  <style> 
	.divcss5{ margin:0 auto;  height:400px; border:0.5px solid #2F4F4F} 
	.divcss5-l{ float:left; width:400px; height:400px; } 
	.divcss5-c{ float:left; width:18%;height:250px;; border:1px solid #2F4F4F}/* 这里宽度是400-120-120-2 */ 
	.divcss5-r{ float:right; width:33%;height:120px;} 
</style>-->
<style type="text/css">
	span{
		color: #999999;
	}
	#title{
		font-size: 16px;
		color: #000000;
		font-family: "微软雅黑";
		font-weight: 700;
	}
	.price{
		background-image: url(../images/detail_bg.png);
	}
	.price{
		margin-top: 10px;
	}
	.price .layui-row{
		padding: 10px;
	}
	#yuanjia{
		color: #ff0066;
		font-size: 20px;
	}
	#yongjin{
		color: #ff0066;
		font-size: 30px;
		font-weight: 700;
	}
	#guanjianci{
		color: #FF4400;
		font-size: 26px;
		font-family: "verdana, geneva, arial, helvetica, sans-serif";
	}
	#yaoqiu{
		color: #A48B67;
		font-size: 16px;
	}
	#dianpuming{
		color: #E5511D;
		font-size: 16px;
		font-weight: 400;
	}
	#lianxifangshi{
		color: #E5511D;
		font-size: 16px;
		font-weight: 400;
	}
	#jiedan{
		width: 100%;
		font-size: 16px;
	}
	.buzhou{
		color: #3C3C3C;
		font-family: tahoma arial;
		font-size: 16px;
	}
	
</style>
</head>
<body>
	<div class="layui-row">
		<div class="layui-row" style="background-color: #EEEEEE;height: 50px; margin-bottom: 10px;">
			<div class="layui-container" id="header">
				<div class="layui-row" height="50px" style="line-height: 50px;">
					<div class="layui-col-md2">
						<img src="../favicon.ico" class="logo" height="50px" />
					</div>
					<div class="layui-col-md2 layui-col-md-offset8">
						<div class="layui-row">
							<div class="layui-col-md8" id="header_login">登录</div>
							<div class="layui-col-md3" id="header_register">
							<a href="user/register.html" >注册</a></div>
						</div>
					</div>
					
				</div>
			</div>
		</div>
		<div class="layui-container">
			<div class="layui-row layui-col-space30">
				<div class="layui-col-md9">
					<div class="layui-row layui-col-space30">
						<div class="layui-col-md6">
							<div class="layui-row">
								<img src="" id="good_img" width="100%" />
							</div>
						</div>
						<div class="layui-col-md6">
							<div class="layui-row">
								<label id="title">
									
								</label>
							</div>
							<div class="layui-row price">
								<div class="layui-row">
									<span>商品原价：<i class="layui-icon" style="color: #ff0066;">&#xe65e;</i></span>
									<label id="yuanjia"></label>
								</div>
								<div class="layui-row">
									<span>任务本金：<i class="layui-icon" style="color: #ff0066; font-size: 13px;">&#xe65e;</i></span>
									<label id="fuhao"></label>
									<label id="benjin"></label>
								</div>
								<div class="layui-row">
									<span>任务佣金：<i class="layui-icon" style="color: #ff0066; font-size: 16px;">&#xe65e;</i></span>
									<label id="fuhao"></label>
									<label id="yongjin"></label>
								</div>
							</div>
							<div class="layui-row" style="margin-top: 10px;padding-left: 10px;">
								<span>任务搜索词：</span>
								<label id="guanjianci"></label>
							</div>
							<div class="layui-row" style="margin-top: 10px;padding-left: 10px;">
								<span>任务要求：</span>
								<label id="yaoqiu"></label>
							</div>
							<div class="layui-row">
								<hr class="layui-bg-orange" />
							</div>
							<div class="layui-row" style="margin-top: 10px;padding-left: 10px;">
								<span>任务店铺名：</span>
								<label id="dianpuming"></label>
							</div>
							<div class="layui-row" style="margin-top: 10px;padding-left: 10px;">
								<span>商家联系方式：</span>
								<label id="lianxifangshi"></label>
							</div>
							<div class="layui-row layui-col-space30" style="margin-top: 10px;padding-left: 10px;">
								<div class="layui-col-md5">
									<button class="layui-btn layui-btn-danger" id="jiedan">立即接单</button>
								</div>
								<div class="layui-col-md5">
									<button class="layui-btn layui-btn-normal" onclick="location.href='t.html'">返回首页</button>
								</div>
							</div>
							<div class="layui-row" style="margin-top: 10px;padding-left: 10px;">
								<span>任务发布时间:</span>
								<label id="shijian"></label>
							</div>
						</div>
					</div>
					<div class="layui-row">
						<div class="layui-row">
							<hr class="layui-bg-red" />
						</div>
						<div class="layui-row">
							<div class="layui-row">
								<blockquote class="layui-elem-quote buzhou">
									接单前，请仔细阅读下方接单步骤
								</blockquote>
								<div class="layui-card">
								  <div class="layui-card-header">卡片面板</div>
								  <div class="layui-card-body">
								    卡片式面板面板通常用于非白色背景色的主体内<br>
								    从而映衬出边框投影
								  </div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="layui-col-md3">
					这里放推荐的这里放推荐的这里放推荐的这里放推荐的这里放推荐的这里放推荐的这里放推荐的这里放推荐的这里放推荐的这里放推荐的
				</div>
			</div>
			<div class="layui-row">
				(c) Copyright 2020 Administrator. All Rights Reserved. 
			</div>
		</div>
	</div>

	<script src="../layui/layui.js"></script>
	<script>
		var id = getQueryVariable('id');
		console.log(id);
		layui.use(['form','layer','upload'],function(){
			var form = layui.form
			,layer = parent.layer === undefined ? layui.layer : top.layer,
			upload =layui.upload,
			$ = layui.jquery;
			
			//$("#header").load("header.html");
			
			
			console.log(localStorage.login_font_name && localStorage.login_font_name!="" );
		if(localStorage.login_font_name && localStorage.login_font_name!=""){
			$("#header_login").html('<a href="index.html" >'+'欢迎:'+localStorage.login_font_name+'</a>');
			$("#header_register").html('');
		}
		else{
			$("#header_login").html('<a href="login.html" >'+'前往登录'+'</a>');
		}
			
			
			
			$.ajax({
				type: 'POST',
				async: false,
				url:  "http://127.0.0.1:88/index.php/font/Font/getfontdetail", //POST傳一個超長字串到後端
				data: "id="+id,
				dataType: "JSON",
				success: function(sss) {
					console.log(sss['data']);
					$("#good_img").attr("src",sss.data[0]['renwu_img_url']);	
					console.log(sss.data[0]['renwu_img_url']);
					$("#title").text(sss.data[0]['renwu_good_titles']);
					$("#yuanjia").text(sss.data[0]['renwu_good_price']);
					$("#benjin").text(sss.data[0]['renwu_good_payPrice']+"元");
					$("#yongjin").text(sss.data[0]['renwu_good_money']+"元");
					$("#guanjianci").text(sss.data[0]['renwu_good_searchWord']);
					$("#dianpuming").text(sss.data[0]['renwu_good_shop']);
					$("#lianxifangshi").text(sss.data[0]['user_name']);//后面改成商家联系方式
					$("#yaoqiu").text(sss.data[0]['renwu_yaoqiu']);
					$("#shijian").text(sss.data[0]['renwu_addTime']);
						//$("#YCXX").val(sss[0]["异常现象"]+';'+$("#YCXX").val());
						//console.log(sss);
						var html='';
						/*for (var k in sss['data']) {
							htmlimg='<div class="layui-col-xs6 layui-col-sm4 layui-col-md3 pailie">'
							+'<img width="330px" src="'+sss.data[k]['renwu_img_url']+'"  alt="">'
							+'</div>';
							htmldetail=
							'&nbsp;&nbsp;<p><i class="layui-icon" style="font-size: 30px; color: #F40;">&#xe653;&nbsp;</i>平台:<span class="shop shubiao">'+sss.data[k]['renwu_shop_type']+'</span></p>'
							+'&nbsp;&nbsp;<p><i class="layui-icon" style="font-size: 30px; color: #F40;">&#xe653;&nbsp;</i>商家:<span class="shop shubiao">'+sss.data[k]['renwu_good_shop']+'</span></p>'
							+'&nbsp;&nbsp;<p class="price">佣金：￥'+sss.data[k]['renwu_good_payPrice']+'元</p>'
							+'&nbsp;&nbsp;<p><i class="layui-icon" style="font-size: 30px; color: #F40;">&#xe653;&nbsp;</i>关键词:<span class="shop shubiao">'+sss.data[k]['renwu_good_searchWord']+'</span></p>'
							+'&nbsp;&nbsp;<p><i class="layui-icon" style="font-size: 30px; color: #F40;">&#xe653;&nbsp;</i>放单时间:<span class="shop shubiao">'+sss.data[k]['renwu_addTime']+'</span></p>'
							+'&nbsp;&nbsp;<p class="price"><button class="layui-btn  layui-btn-radius " id="keepbutton">接单</button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="t.html">返回</a></p>'
						}
						$("#imgs").html(htmlimg);detalimformation
						$("#detalimformation").html(htmldetail);
						layui.use(['form'], function() {
							var form = layui.form;
							form.render();
						});*/
				}
			});
			$("#jiedan").click(function() {
				$("#jiedan").attr("disabled", true); //存储按钮禁用
				$("#jiedan").html("接单成功");
				$("#jiedan").attr("class", 'layui-btn layui-btn-sm layui-btn-disabled'); //渲染
				$.ajax({ //结束时间
					type: 'POST',
					url: "http://127.0.0.1:88/index.php/font/Font/successorder",
					dataType: "text",
					data: "id="+id+"&user_name="+localStorage.login_font_name,
					success: function(sss) {
						layer.msg(sss);
					}
				});
			});
			
			
			
			
			
		})
		
		function getQueryVariable(variable) {//获取参数id
			var query = window.location.search.substring(1);
			var vars = query.split("&");
			for (var i=0;i<vars.length;i++) {
				var pair = vars[i].split("=");
				if(pair[0] == variable){return pair[1];}
			}
			return(false);
		}

	</script>
</body>
</html>